<template>
  <div :class="['el-skeleton__item', `el-skeleton__${variant}`]">
    <img-placeholder v-if="variant === 'image'" />
  </div>
</template>

<script>
/**
 * https://element-plus.gitee.io/#/zh-CN/component/skeleton
 * 搬运自Element Plus
 * Skeleton-item 骨架屏（兼容Vue2.0）
 */
import ImgPlaceholder from './img-placeholder.vue'

export default {
  name: 'ElSkeletonItem',
  components: { ImgPlaceholder },
  /**
   * @variant 当前显示的占位元素的样式  支持元素 p / text / h1 / h3 / text / caption / button / image / circle / rect
   */
  props: {
    variant: {
      type: String,
      default: 'text'
    }
  }
}
</script>
